<template>
  <div>
    <zm-form :model="offlineRule" ref="form" label-width="150px">
    <!-- 选择影院组件 -->
    <cinema-radio
      v-model="offlineRule"
      @input="(val) => handleFinalAfter(val)"
    ></cinema-radio>
    <zm-form-item label="是否限制使用时间">
      <el-radio-group
        v-model="offlineRule.isLimitUseTime"
        @change="handleClearTime"
      >
        <el-radio label="0">不限制</el-radio>
        <el-radio label="1">限制</el-radio>
      </el-radio-group>
      <zm-form-item
      class="dib"
        v-if="offlineRule.isLimitUseTime === '1'"
        :prop="`useStartTime`"
        :rules="{
          required: true,
          message: '*为必填，不能为空',
          trigger: 'blur',
        }"
      >
      <zm-date-picker
        class="ml10"
        type="datetimerange"
        :target="offlineRule"
        start-key="useStartTime"
        end-key="useEndTime"
      />
      </zm-form-item>
    </zm-form-item>
    </zm-form>
  </div>
</template>

<script>
import CinemaRadio from '@/views/product/components/CinemaRadio'
import tableMixin from '@/mixins/zmTableMixin'
export default {
  name: 'SellOfflineRule',
  components: { CinemaRadio },
  mixins: [tableMixin],
  inject: ['$product'],
  data () {
    return {
      isShowLimitTime: false // 控制限额
    }
  },
  computed: {
    offlineRule: {
      get () {
        return this.$product.form.offlineRule[0]
      },
      set (v) {
        this.$product.form.offlineRule[0] = v
      }
    }
  },
  watch: {},
  created () {},
  methods: {
    // 选择影院组件回调
    handleFinalAfter (val = { relationType: '-1', relationId: '-1' }) {
      if (val.relationType === '-1') {
        val.relationId = '-1'
      }
      this.$set(this.$product.form.offlineRule, 0, {
        ...this.offlineRule,
        ...val
      })
    },
    validate () {
      return new Promise((resolve, reject) => {
        this.$refs.form.validate(valid => {
          if (valid) {
            resolve()
          } else {
            reject('线下规则')
          }
        })
      })
    },
    handleClearTime (val) {
      this.$set(this.offlineRule, 'useStartTime', '')
      this.$set(this.offlineRule, 'useEndTime', '')
    }
  }
}
</script>

<style scoped lang='scss'>
</style>
